<template>
    <view class="page-my-index">
        <view class="fly-card info">
            <view class="item" @click="gotoPage('/packageA/account/info')">
                <view class="thumb">
                    <u-image width="120rpx" height="120rpx" src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle"></u-image>
                </view>
                <view class="content">
                    <view class="title">{{ userInfo.nickname || userInfo.username}}</view>
                    <view class="desc mt-1">
                        <!-- <u-tag text="信用积分 60" size="mini"></u-tag> -->
                        点击这里，填写简介
                    </view>
                </view>
                <view class="icon">
                    <u-icon name="edit-pen"></u-icon>
                </view>
            </view>
            <!-- <view class="intro">个人简介</view> -->
            <view class="banner">
                <u-image width="100%" mode="widthFix" :src="proxy.$icon.invite"></u-image>
            </view>
        </view>    
        <view class="mx-4 py-4">  
            <view class="nav">
                <!-- <u-grid :col="4" :border="false">
                    <u-grid-item v-for="(item,index) in nav" @click="gotoPage(item.url)">
                        <template #icon>
                            <u-image width="48rpx" height="48rpx" :src="item.icon"></u-image>
                        </template>
                        <view class="grid-text">{{ item.title }}</view>
                    </u-grid-item>
                </u-grid> -->
                <u-row gutter="18">
                    <u-col span="6" v-for="(item,index) in nav" :key="index">
                        <view class="flex-between" @click="gotoPage(item.url)">
                            <view class="flex-block">
                                <u-image width="48rpx" height="48rpx" :src="item.icon"></u-image>
                                <text class="title">{{ item.title }}</text>
                            </view>
                            <u-icon name="arrow-right" color="#969799"></u-icon>
                        </view>
                    </u-col>
                </u-row>
            </view>
            <view class="menu">
                <u-cell-group>
                    <u-cell-item v-for="(item,index) in menu" :key="index" :title="item.title" :icon="item.icon" :border-bottom="menu.length - 1 == index ? false : true" @click="gotoPage(item.url)"/>
                </u-cell-group>
            </view>
            <view class="menu mt-2">
                <u-cell-group>
                    <u-cell-item title="设置" :icon="proxy.$icon.setting" :border-bottom="false" @click="gotoPage('/packageA/setting/index')"/>
                </u-cell-group>
            </view>
        </view>
        <fly-tabbar ref="refFlyTabbar" :current="4"/>
    </view>
</template>
<script setup lang="ts">
import { onShow } from '@dcloudio/uni-app';
import FlyTabbar from '@/components/FlyTabbar/index.vue'
const refFlyTabbar = ref();
import { useAppStore } from '@/stores/app';
let appStore = useAppStore();
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
let userInfo = ref();
let nav = reactive([
    {title:'订单', icon: proxy.$icon.order, url: '/packageB/bill/list'},
    {title:'活动', icon: proxy.$icon.activity, url: '/packageB/activity/list'},
    {title:'创作', icon: proxy.$icon.creation, url: '/packageB/creation/list'},
    {title:'收藏', icon: proxy.$icon.collect, url: '/packageB/collect/list'},
    {title:'邀请码', icon: proxy.$icon.invitationcode, url: '/packageB/invitation/list'},
    {title:'客服', icon: proxy.$icon.customer, url: '/packageA/service/index'},
]);
let menu = reactive([
    {title:'我的会员', icon: proxy.$icon.mymember, url: '/packageA/member/list'},
    {title:'联系分会长', icon: proxy.$icon.contactbranchpresident, url: '/packageA/branch/connect'},
    {title:'建立分会', icon: proxy.$icon.establishbranch, url: '/packageA/branch/add'},
    {title:'会长菜单', icon: proxy.$icon.presidentmenu, url: '/packageA/branch/menu'},
    // {title:'设置', icon: proxy.$icon.setting, url: '/packageA/setting/index'},
]);
const gotoPage = (url) => {
    proxy.$util.gotoPage(url)
}
onShow(() => {
    userInfo.value = appStore.userInfo;
 })
</script>